$(function(){
    let btn = $("#btn")
    let container = $("#container")
    btn.click(function(){
        huoqu()
        .done(function(data){
             console.log(data);
             xuanran(data,data.object_list)
             sort()
            // console.log( $(".lazy"))
             $(".lazy").lazyload();
        })
    })
    function huoqu(){
        let options={
            url:"http://127.0.0.1:8888/proxy/dt",
            type:"GET",
            data:{
                include_fields: "top_comments,is_root,source_link,item,buyable,root_id,status,like_count,sender,album,reply_count",
                              filter_id: "文字句子",
                              start: 24,
            },
            dataType:"json"
        }
        return $.ajax(options)
    }
    function xuanran(data){
         console.log(data.data.object_list);
        container.html(data.data.object_list.map(item=>
            `
            <div class="box">
              <img class="lazy" height=${ item.photo.height / item.photo.width * 235 } data-original=${item.photo.path}>
                

                 <div></div>
                 </div>
            `
            ).join(""))
    }

    function sort(){
       let box = $(".box")
    //    console.log(box);
       let heigth_array=[]
       let offset_array=[]
       $.each(box,function(index,ele){
           
           if(index<4){
               heigth_array.push($(ele).outerHeight())
                offset_array.push($(ele).position().left)
           }else{
               let min_height = Math.min.apply(false,heigth_array)
               let min_index = heigth_array.indexOf(min_height); 
               let _left = offset_array[min_index]
               console.log(min_height);
               $(ele).css({
                position: "absolute" ,
                top:min_height,
                left:_left
               })
                heigth_array[min_index]+=$(ele).outerHeight()
           }
          
       })
    }
})